<template>
  <div>
      <div style="margin:20px;">
        <el-input @input="toSearch" v-model="username" placeholder="员工姓名"></el-input>
      </div>
     
      <el-tree :default-expand-all="true" :data="treeList" :props="defaultProps" @node-click="handleNodeClick" >

      </el-tree>
  </div>
</template>

<script>
import {getDepartmentApi} from '@/api/personnel'
import {treeData,debounce} from '@/utils/tool'
export default {
  name: 'EmployeeDepart',

  data() {
    return {
      treeList:[],
      username:"",
        defaultProps: { //改变树形 默认加载的 字段名
          children: 'children',
          label: 'name'
        }
    };
  },
  created(){
    this.getDepart();
  },
  mounted() {
  
  },

  methods: {
     loadSearch(){ //发送姓名给兄弟查询
        this.$bus.$emit("sendname",this.username)
     },
    //  防抖查询事件的input事件
     toSearch:debounce(function(){
              // 让执行的内容防抖
            this.loadSearch();
      },500),
      handleNodeClick(data){ //发送部门id给兄弟组件 
          this.$bus.$emit("senddeaprt",data.id)
      },
      async getDepart(){ //获取部门树形数据
        let res=await getDepartmentApi()
        console.log(res,"-0000000000");
        this.treeList=treeData(res.data)
      },
      // func 要防抖的函数  wait 防抖的时间
  
  },
};
</script>